<template>
	<view>
		<view class="b_top"></view>
		<!-- 进行中 -->
		<view class="mt-5" v-if="u_loadmore">
			<u-loadmore status="loading" icon-type="circle" />
		</view>
		<view v-else>
			<view class=""  v-if="saleList.length>0">
				<u-swipe-action :show="!item.checked" :index="index"
					v-for="(item, index) in saleList" :key="index" :btn-width="btnWidth"
					@click="click" :options="options" >
					<view class="goods_card border-bottom bg-white mx-2 p-3 rounded-20 a-center d-flex">
							<view class="mr-3" @click="amiton(item)">
								<u-icon name="minus-circle-fill" color="#ff3333" size="40"></u-icon>
							</view>
							<view class="goods_card_head d-flex">
								<view class="goods_card_head_left position-relative ">
									<image class="" :src="item.img.url?item.img.url:defaltImage" mode=""></image>
								</view>
								<view class="goods_card_head_right pl-3">
									<view class="d-flex">
										<view class="ellipsis pro_name">
											{{item.name}}
										</view>
									</view>
								</view>
							</view>
					</view>
				</u-swipe-action>		
			</view>
			<view class="" v-else>
				<u-swipe-action :show="!item.checked" :index="index"
					v-for="(item, index) in info_list" :key="index" :btn-width="btnWidth"
					@click="click" :options="options" >
					<view class="goods_card border-bottom bg-white mx-2 p-3 rounded-20 a-center d-flex">
						<view class="mr-3" @click="amiton(item)">
							<u-icon name="minus-circle-fill" color="#ff3333" size="40"></u-icon>
						</view>
						<view class="goods_card_head d-flex">
							<view class="goods_card_head_left position-relative ">
								<image class="" :src="item.image?item.image:defaltImage" mode=""></image>
							</view>
							<view class="goods_card_head_right pl-3">
								<view class="d-flex">
									<view class="ellipsis pro_name">
										{{item.name}}
									</view>
								</view>
							</view>
						</view>	
					</view>
				</u-swipe-action>
			</view>
		</view>
		<view class="footer"></view>
		<view class="">
			<view class="bg-white py-2 d-flex j-sb px-5  w-100 position-fixed bottom-0 btn">
				<button type="default" @click="ass_goods" class="ass">添加</button>
				<button type="warn" @click="determine" class="hold">确定</button>
			</view>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				saleList:[], // 在售商品列表
				btnWidth: 140,
				show: false,
				options: [
					{
						text: '删除',
						style: {
							backgroundColor: '#ff3333',
							color:"#ffffff"
						}
					}
				],
				message:"",
				edit:"", // 详情
				info_list:"", // 详情列表
				u_loadmore:true, // 加载中
				
				selected:"", // 已选中
			}
		},
		methods: {
			// 删除弹框
			amiton(item){
				item.checked=false
			},
			// 删除
			click(index,index1) {
				console.log(index,index1)
				if(this.edit){
					if(index1 == 0) {
						this.saleList.splice(index, 1);
						this.info_list.splice(index, 1);
						this.$u.toast(`删除成功`);
						this.btnWidth=0
						this.$nextTick(function(){
							this.btnWidth=140
						})
					}
				}else{
					if(index1 == 0) {
						this.saleList.splice(index, 1);
						this.$u.toast(`删除成功`);
						this.btnWidth=0
						this.$nextTick(function(){
							this.btnWidth=140
						})
					}
				}
			},
			
			// 添加
			ass_goods(){
				if(this.message){
					uni.redirectTo({
						url:'/pagesA/cash/cash-goods'
					})
				}else {
					uni.navigateBack({
						delta:1
					})
				}
			},
			// 确定
			determine(){
				var globalData = getApp().globalData.selected;
				getApp().globalData.selected=true
				
				var globalData = getApp().globalData.act_range;
				getApp().globalData.act_range=3
				var globalData = getApp().globalData.act_range_message;
				getApp().globalData.act_range_message="商品"
				if(uni.getStorageSync("cash_goods")){
					uni.setStorageSync("cash_goods",JSON.stringify(this.saleList))
				}else{
					uni.setStorageSync("cash_good",JSON.stringify(this.info_list))
				}
				if(this.message){
					uni.navigateBack({
						delta:1
					})
				}else{
					uni.navigateBack({
						delta:2
					})
				}
			}
		},
		onLoad(e) {
			console.log(e)
			this.selected=e.selected
			this.edit=e.edit
			this.message=e.goods
			if(e.edit){
				if(e.selected){
					this.info_list=JSON.parse(uni.getStorageSync("cash_good"))
					this.u_loadmore=false 
				}else{
					this.$H.post("admin/favourable/info",{
						act_id:e.act_id
					}).then(res=>{
						let arr=res.data.act_range_ext
						arr.filter(v=>{
							return v.checked=false
						})
						this.info_list=arr
						this.u_loadmore=false 
					})
				}
			}
			if(uni.getStorageSync("cash_goods")){
				this.saleList=JSON.parse(uni.getStorageSync("cash_goods"))
				this.u_loadmore=false 
			}
		}
	}
</script>

<style>
	.goods_card_head_left{
		width: 200upx;
		height: 200upx;
	}
	.goods_card_head_left image{
		width: 200upx;
		height: 200upx;
		border-radius: 20upx;
	}
	.goods_card_head_right image{
		width: 30upx;
		height: 30upx;
	}
	.btn /deep/ button{
		width: 45%;
		border-radius: 60upx;
		background: linear-gradient(to right,#F31E3E,#FB4F37);
	}
	
	.btn_ass /deep/ .hold_ass{
		width: 90%;
		border-radius: 60upx;
		background: linear-gradient(to right,#F31E3E,#FB4F37);
	}
	.btn /deep/ .ass{
		border: 1px solid #FB0D1B;
		color: #FB0D1B;
		background: #FFFFFF;
	}
	.btn /deep/ .ass::after{
		border: none;
	}
</style>
